1.js显示地图 

 

/* 选择容器；设置地图的中心点，并标记 */        var marker, map = new AMap.Map("container", {            resizeEnable: true,            center: [114.290924,30.601394],            zoom: 13        });         /* 设置地图的中心点，并标记 */        var marker2, map2 = new AMap.Map("container2", {            resizeEnable: true,            center: [114.290924,30.601394],            zoom: 13        });

2.点击获取地图经纬度坐标；创建marker点

/* 点击获取地图坐标 */        var clickEventListener = map.on('click', function(e) {           document.getElementById("xy").value = e.lnglat.getLng() + ',' + e.lnglat.getLat();           /* 点击一次新增一个标记点 */             var marker= new AMap.Marker({                map:map,                position:[e.lnglat.getLng(),e.lnglat.getLat()]                 });                        });

3.在地图上绘制多边形折线

//在地图上绘制折线        var editor={};        editor._polygon=(function(){            return new AMap.Polygon({                map: map,                path: lineArr,/* 这里是一个数组； */                strokeColor: "#0000ff",                strokeOpacity: 1,                strokeWeight: 3,                fillColor: "#CD2626",                fillOpacity: 0.35            });        })();        map.setFitView();                editor._polygonEditor= new AMap.PolyEditor(map, editor._polygon);

第二种绘制图形

// 绘制轨迹                             var polyline = new AMap.Polyline({                                map: map,                                path: lineArr,/* 这里是坐标数组 */                                strokeColor: "red",  //线颜色                                strokeOpacity: 1,     //线透明度                                strokeWeight: 1,      //线宽                                strokeStyle: "solid"  //线样式                            });                                                         map.setFitView();                                /*  将画线的区域渲染颜色*/                            var polygon = new AMap.Polygon({                                map: map,                                fillOpacity:0.4,                                path: lineArr                            });

4.开始编辑多边形；结束编辑多边形

/* 开始编辑 */        editor.startEditPolygon=function(){            editor._polygonEditor.open();        }        /*结束编辑 */        editor.closeEditPolygon=function(){            /* 结束编辑时会自动将坐标全部存在数组内                ；将数组转为字符串，以#号分隔 */          var  arg = lineArr.join("#");          document.getElementById("arg").value=arg+"#"; /* 这里是将数组转成的字符串存起来 */          editor._polygonEditor.close();        }

5.清除标记的方法

map.clearMap();

6，当时为了去除地图上的样式，起到刷新地图的效果；没有找到更好的方法，选择的重新加载一遍地图。覆盖之前的；也就是在div里重新加载一次；

7，自定义图标以及样式

marker= new AMap.Marker({                            title:name,/* 鼠标放上去显示的标题 */                            map: map,                            position: arr,/*  坐标数组*/                            icon: new AMap.Icon({                                            size: new AMap.Size(50,50),  //图标大小                                image: "static/img/1.png",/*图片路径  */                                imageOffset: new AMap.Pixel(0,0)/* 偏移量 */                                        })                                        });                                    marker.setLabel({
     //label默认蓝框白底左上角显示，样式className为：amap-marker-label；可以在css样式里调整                            offset: new AMap.Pixel(-20,20),//修改label相对于maker的位置                            content:""+name+""/* 这里写的是html代码 */                        })

 8.自定义标记及标记里面的文字

AMapUI.loadUI(['overlay/SimpleMarker'], function(SimpleMarker) {                                         new SimpleMarker({                                             //普通文本                                             iconLabel: '起',                                             iconStyle: 'green',                                             map: map,                                             position: [arr[0].y,arr[0].x]                                          });                                          new SimpleMarker({                                             //普通文本                                             iconLabel: '终',                                             iconStyle: 'red',                                             map: map,                                                           position: [arr[arr.length-1].y,arr[arr.length-1].x]                                          });                                      });

 9.多边形图形添加点击事件、多边形点击事件、弹窗信息

//在指定位置打开信息窗体        function openInfo() {            alert(123);            //构建信息窗体中显示的内容            var info = [];            info.push("
     
      
       
      
 ");            info.push("
      
       
高德软件
       ");            info.push("
       
电话 : 010-84107000   邮编 : 100102
");            info.push("
       
地址 :北京市朝阳区望京阜荣街10号首开广场4层
      
     
");            infoWindow = new AMap.InfoWindow({                content: info.join("")  //使用默认信息窗体框样式，显示信息内容            });            infoWindow.open(map, map.getCenter());        }

var polygon = new AMap.Polygon({                map: map,                path: lineArr,/* 这里是一个数组； */                strokeColor: "#0000ff",                strokeOpacity: 1,                strokeWeight: 3,                fillColor: "#CD2626",                fillOpacity: 0.35            });                 //多边形添加点击事件             polygon.on('click', function(){                 openInfo();                 });